﻿@{
    Layout = null;
}

<h4>Settings Grid</h4>
<div>
<table id="marbleTable" class="table marbleTable table-bordered" style="overflow-y:auto;height:500px">  
        <thead class="thead-dark">  
            <th class="ccc">Id</th>  
            <th>Name</th>  
            <th>Caption</th>  
            <th>Type</th>
            <th>Description</th>  
            <th>DefaultValue</th>
            <th>ScreenGroup</th>  
            <th>Active</th>  
            <th>UserLevel</th>  
            <th>PosLevel</th>  
            <th>LastUpdatedBy</th>  
            <th>LastUpdatedDate</th>     
        </thead>  
    <tbody>
        @foreach (var item in ViewBag.GetSetting)  
        {  
            <tr onchange="UpdatedList(this)"> 
        <td class="vaaa"> @item.Id  </td>
        <td> <input type="text" value="@item.Name" class="gridText" />  </td>
  
        <td> <input type="text" value="@item.Caption" class="gridText" />  </td>
                     <td> <select name="TypeList" id="TypeList" class="gridText">
              @foreach (var dow in item.BasicDataTypes)
              {
                if(@item.Type == @dow.Value)
                {
                    <option value="@dow.Value" selected>@dow.Value</option>
                }
                else
                {
                    <option value="@dow.Value">@dow.Value</option>
                }
              }
            </select> 
        </td>
        <td> <input type="text" value="@item.Description" class="gridText" />  </td>
        <td> <input type="text" value="@item.DefaultValue" class="gridText"/>  </td>

        <td> <input type="text" value="@item.ScreenGroup" class="gridText"/>  </td>
        <td> <input type="checkbox" @(item.Active ? "checked='checked'" : "")  value="@item.Active" class="gridText"/>  </td>
        <td> <input type="checkbox" @(item.UserLevel ? "checked='checked'" : "") value="@item.UserLevel" class="gridText"/>  </td>
        <td> <input type="checkbox" @(item.PosLevel ? "checked='checked'" : "")  value="@item.PosLevel" class="gridText"/>  </td>
        <td> <input type="text" value="@item.LastUpdatedBy" class="gridText" disabled/>  </td>
        <td> <input type="text" value="@item.LastUpdatedDate" class="gridText" disabled/>  </td>
    </tr>  
        }  
        </tbody>
    </table>
    
    <button class="btn btn-primary btn-md" role="button" onclick="SaveProducts()">Save</button>    
</div>
<style>
    .takea {
      display: block; height: 500px; overflow-y: auto
    }
    .not-hide {
         position:absolute;    
         left: 291px; 
    }
    .wid {
            left: 301px;
    }
    .vaaa {
        position: static;

    width: 33px;
    }
    .ccc {
            position: static;
    
    }
</style>
<script>
    $(document).ready(function () {
       
    })
    function SaveProducts() {
        $('#loading').show();
        var settings = [];
        var table = document.getElementById('marbleTable');
        for (var r = 1, n = table.rows.length; r < n; r++) {
            if (updatedArray.includes(r)) {
                settings.push({
                        Id: table.rows[r].cells[0].innerHTML,
                        Name: table.rows[r].cells[1].children[0].value,
                        Caption: table.rows[r].cells[2].children[0].value,
                        Type: table.rows[r].cells[3].children[0].value,
                        Description: table.rows[r].cells[4].children[0].value,
                        DefaultValue: table.rows[r].cells[5].children[0].value,
                        ScreenGroup: table.rows[r].cells[6].children[0].value,
                        Active: table.rows[r].cells[7].children[0].checked,
                        UserLevel: table.rows[r].cells[8].children[0].checked,
                        PosLevel: table.rows[r].cells[9].children[0].checked,
                        LastUpdatedBy: table.rows[r].cells[10].children[0].value,
                        LastUpdatedDate: table.rows[r].cells[11].children[0].value,
                    });
            }
        }
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: '@Url.Action("UpdateSettings", "SiteSetup")',
            data: JSON.stringify({ settings: settings }),
                dataType: "json",
                success: function (data) {
                    alert('Data Saved');

                    location.reload();
                  
                },
                error: function (e) {
                    $('#loading').hide();
                    alert(e);
                }
         });
    }
    var updatedArray = [];
    function UpdatedList(x) {
        if (!updatedArray.includes(x.rowIndex)) {
            updatedArray.push(x.rowIndex);
        }
    }
    
 </script>